import './everyDayKind.scss'
import CONSTANT from '@/common/constants.js'
import http from '@/common/http.js'
import Checklist from 'vux/src/components/checklist/index.vue'
import XSwitch from 'vux/src/components/x-switch/index.vue'
import Group from 'vux/src/components/group/index.vue'
import Picker from 'vux/src/components/picker/index.vue'
import Popup from 'vux/src/components/popup/index.vue'
import Cell from 'vux/src/components/cell/index.vue'
import CheckIcon from 'vux/src/components/check-icon/index.vue'
import TransferDom from 'vux/src/directives/transfer-dom/index'

let hours = []
let minutes = []
var events = []
for (var i = 1; i <= 24; i++) {
  hours.push({
    name: i + '时',
    value: i + ''
  })
}
for (var m = 0; m <= 59; m++) {
  var ms = m
  if (ms < 10) {
    ms = '0' + ms
  }
  minutes.push({
    name: ms + '分',
    value: ms + ''
  })
}
http.post(CONSTANT.EVENT_MODE, {}, (res) => {
  if (res.code == 200) {
    // events = res.list
    for (var e = 0; e < res.list.length; e++) {
      var arrone = {}
      arrone.name = res.list[e].eventName
      arrone.value = res.list[e].id
      events.push(arrone)
    }
  }
})
let userId = window.sessionStorage.getItem('userId')
export default {
  name: 'findrank',
  directives: {
    TransferDom
  },
  components: { Checklist, XSwitch, Group, Picker, Popup, Cell, CheckIcon },
  data () {
    return {
      labelPosition: 'left',
      commonList: [ '周一', '周二', '周三', '周四', '周五', '周六', '周日' ],
      commonList1: [ '每天' ],
      commonListOne: ['每天', '每周', '每月'],
      everyMonthList: [],
      checklist01: [],
      checklist02: [],
      checklist03: [],
      checkIcon0: true,
      checkIcon1: false,
      checkIcon2: false,
      enentChoose0: true,
      enentChoose1: false,
      stringValue: true,
      witchOne: 'day',
      ifOpen: '开启',
      years1: [hours, [{name: '00分', value: '00'}, {name: '30分', value: '30'}]],
      eventCh: [events],
      time04: ['11', '00'],
      event01: ['0', ''],
      eventTitle: '',
      showgr: false,
      showxm: false,
      showmz: false,
      showmy: false,
      thetime: '11:00',
      disabled01: false,
      disabled02: false,
      demoMy: [],
      id: '',
      firstEvents: '',
      firstIds: '',
      eventAll: []
    }
  },
  watch: {
    checkIcon0: function (val) {
      // 每天
      if (val == true) {
        this.checkIcon1 = false
        this.checkIcon2 = false
        this.witchOne = 'day'
        this.checklist02 = []
        this.checklist03 = []
        this.stringValue = true
        this.space()
      }
    },
    checkIcon1: function (val) {
      // 每周
      if (val == true) {
        this.checkIcon0 = false
        this.checkIcon2 = false
        this.witchOne = 'week'
        this.checklist03 = []
        this.stringValue = true
        this.space()
        this.showmz = true
      }
    },
    checkIcon2: function (val) {
      // 每月
      if (val == true) {
        this.checkIcon0 = false
        this.checkIcon1 = false
        this.witchOne = 'month'
        this.showmy = true
        this.stringValue = true
        this.checklist02 = []
      }
    },
    enentChoose0: function (val) {
      // 随机项目
      if (val == true) {
        this.enentChoose1 = false
        this.stringValue = true
        this.id = '0'
        this.eventTitle = ''
      }
    },
    enentChoose1: function (val) {
      // 指定项目
      if (val == true) {
        this.showxm = true
        this.stringValue = true
        if (this.id == '0') {
          this.event01 = ['0', '']
        }
        if (this.showmz == true || this.showmy == true) {
          this.showxm = false
        }
        this.enentChoose0 = false
      }
    }
  },
  created () {
  },
  mounted () {
    // MEMORANDUM_SAVE
    if (this.$emit('ifOpenid')) {
      this.$emit('ifOpenid', this.$route.path)
    }
    http.post(CONSTANT.EVENT_MODE, {}, (res) => {
      console.log('mode', res)
      if (res.code == 200) {
        this.firstEvents = res.list[0].eventName
        this.firstIds = res.list[0].id
        this.eventAll = res.list
      }
    })
    this.obtain()
    // console.log(this.$refs.checkDay.children[0].innerHTML)
  },
  methods: {
    obtain () {
      http.post(CONSTANT.MEMORANDUM_VIEW, {user_id: userId}, (res) => {
        console.log(res)
        if (res.code == 200) {
          this.time04 = [res.obj.hour, res.obj.minute]
          this.thetime = res.obj.hour + ':' + res.obj.minute
          if (res.obj.status == 1) {
            this.stringValue = true
          } else {
            this.stringValue = false
          }
          if (res.obj.eventId == '0') {
            this.enentChoose0 = true
            this.id = res.obj.eventId
          } else if (res.obj.eventId == '') {
            this.enentChoose0 = false
            this.enentChoose1 = false
          } else {
            this.enentChoose0 = false
            this.enentChoose1 = true
            this.event01[0] = res.obj.eventId
            this.event01[1] = res.obj.eventName
            this.id = res.obj.eventId
            this.eventTitle = res.obj.eventName
          }
          if (res.obj.cycle == 'day') {
            this.checklist01 = []
            this.checkIcon0 = true
          } else if (res.obj.cycle == 'week') {
            this.checklist02 = res.obj.time
            this.checkIcon1 = true
          } else if (res.obj.cycle == 'month') {
            this.checklist03 = res.obj.time
            this.checkIcon2 = true
            this.space()
          }
        }
      })
    },
    everyDayCheck (val) {
      console.log(val)
    },
    ifPramise () {
      // 保存之前的判断
      if (this.stringValue == true) {
        if (this.enentChoose0 == false && this.enentChoose1 == false) {
          alert('请进行项目选择！')
        } else if (this.enentChoose1 == true && this.id == '') {
          alert('请选择将要提醒的项目！')
        } else if (this.checkIcon0 == false && this.checkIcon1 == false && this.checkIcon2 == false) {
          alert('请选择一种提醒周期！')
        } else if (this.checkIcon1 == true && this.checklist02.length == 0) {
          alert('请选择每周的哪些天进行提醒！')
        } else if (this.checkIcon2 == true && this.checklist03.length == 0) {
          alert('请选择每月的哪些天进行提醒！')
        } else {
          this.pramise()
        }
      } else {
        this.pramise()
      }
    },
    pramise () {
      // 保存按钮
      var status = ''
      var hour = ''
      var minute = ''
      var cycle = ''
      hour = this.time04[0]
      minute = this.time04[1]
      console.log(typeof hour)
      if (this.witchOne == 'day') {
        cycle = this.checklist01
      } else if (this.witchOne == 'week') {
        cycle = this.checklist02
      } else {
        cycle = this.checklist03
      }
      console.log(cycle)
      if (this.stringValue == false) {
        status = 0
      } else {
        status = 1
      }
      console.log(this.witchOne)
      console.log('id', this.id)
      http.post(CONSTANT.MEMORANDUM_SAVE, {user_id: userId, cycle: this.witchOne, time: cycle, status: status, hour: hour, minute: minute, event_id: this.id}, (res) => {
        console.log(res)
        if (res.errmsg == '保存成功') {
          alert('保存成功！')
          window.history.go(-1)
        }
        if (res.errmsg == '修改成功') {
          alert('修改成功')
          window.history.go(-1)
        }
      })
    },
    space () {
      // this.$refs.checkDay.children[0].style.backgroundColor = 'red'
      console.log(this.$refs.checkDay.children.length)
      if (this.checklist03.length == 0) {
        for (var a = 0; a < this.$refs.checkDay.children.length; a++) {
          this.$refs.checkDay.children[a].style.backgroundColor = ''
          this.$refs.checkDay.children[a].style.color = '#333'
        }
        return
      }
      console.log('for')
      for (var i = 0; i < this.checklist03.length; i++) {
        for (var m = 0; m < this.$refs.checkDay.children.length; m++) {
          if (this.checklist03[i] == this.$refs.checkDay.children[m].innerHTML) {
            this.$refs.checkDay.children[m].style.backgroundColor = '#1AAC19'
            this.$refs.checkDay.children[m].style.color = '#fff'
          }
        }
      }
    },
    switchChange (val) {
      // 开启关闭按钮
      console.log(val)
      if (val == false) {
        this.ifOpen = '关闭'
      } else {
        this.ifOpen = '开启'
      }
    },
    timeDate () {
      this.showgr = true
    },
    change (val, label) {
      // 选择周期
      console.log(this.checklist02)
      // this.checklist02.sort()
    },
    changepicker (value) {
      console.log(this.time04)
      this.thetime = this.time04[0] + ':' + this.time04[1]
      console.log(value, 'value')
    },
    changevent (value) {
      console.log(value)
      this.id = value
      for (var i = 0; i < this.eventCh[0].length; i++) {
        if (this.event01[0] == this.eventCh[0][i].value) {
          // console.log(this.eventCh[0][i].name)
          this.eventTitle = this.eventCh[0][i].name
          return
        }
      }
    },
    onChangemy (val) {
      console.log(val)
    },
    checkDay (index, val, e) {
      console.log(this.checklist03)
      if (e.target.style.backgroundColor == '') {
        e.target.style.backgroundColor = '#1AAC19'
        e.target.style.color = '#fff'
        this.checklist03 = this.checklist03.concat(val)
        // this.checklist03.sort()
        this.checklist03.sort(function (a, b) {
          // 排序 升序排列
          return a - b
        })
      } else {
        e.target.style.backgroundColor = ''
        e.target.style.color = '#333'
        for (var i = 0; i < this.checklist03.length; i++) {
          if (this.checklist03[i] == val) {
            this.checklist03.splice(i, 1)
          }
        }
      }
      console.log(this.checklist03)
    },
    closegr () {
      this.showgr = false
    },
    closexm () {
      if (this.eventTitle == '') {
        this.eventTitle = this.firstEvents
        this.id = this.firstIds
      }
      this.showxm = false
    },
    closemz () {
      this.showmz = false
    },
    closemy () {
      this.showmy = false
    },
    comeBack () {
      window.history.go(-1)
    }
  }
}
